<template>
	<uni-popup ref="popup" type="bottom" @change="change">
		<view class="popup-content d-flex flex-column">
			<view class="d-flex justify-content-end">
				<image src="https://mp-cc85421a-533b-4b68-b797-f0a3eba335d0.cdn.bspapp.com/common/clousex-big.png"
					class="close_btn" @tap="close"></image>
			</view>
			<view class="d-flex flex-fill flex-column ">
				<view class="d-flex flex-column">
					<view class="font-size-extra-lg font-weight-bold text-color-base mb-30">欢迎登陆快乐星球~</view>
					<view class="font-size-base text-color-assist">登录后立享9.9任选一杯~免费送</view>
				</view>
				<view style="margin: 20rpx;">
					<image src="https://mp-cc85421a-533b-4b68-b797-f0a3eba335d0.cdn.bspapp.com/gif/happy3.gif" mode=""
						style="background-size: cover;width: 140px;height: 130px;margin-left: 20rpx;"></image>
					<image src="https://mp-cc85421a-533b-4b68-b797-f0a3eba335d0.cdn.bspapp.com/gif/happy1.gif" mode=""
						style="background-size: cover;width: 100px;height: 120px;margin-left: 90rpx;"></image>
				</view>
				<view class="d-flex flex-column">
					<button style="border-radius: 20rpx;" type="primary" class="w-100 font-size-lg mb-30"
						open-type="getUserInfo" @click="updateUserProfile" @tap="close">微信一键登陆</button>
					<view class="text-center mb-30 font-size-sm text-color-assist">
						点击登陆HappyTea，即表示已阅读并同意<font class="text-color-primary">《HT隐私政策》</font>
					</view>
					<view class="text-center font-primary font-size-sm text-color-primary">《HT小程序服务指南》</view>
				</view>
			</view>
		</view>
	</uni-popup>
</template>

<script>
	import cloudApi from '@/common/cloudApi.js'
	import uniPopup from '@/components/uni-popup/uni-popup.vue'
	import {
		mapMutations
	} from 'vuex'

	export default {
		name: 'LoginPopup',
		data() {
			return {
				userInfo: []
			}
		},
		components: {
			uniPopup
		},
		props: {

		},
		mounted(options) {
			uni.login({
				provider: "weixin",
				success: (res) => {
					var code = res.code;

					cloudApi.call({
						name: "login",
						data: {
							code: code
						},
						success: (res) => {
							this.userInfo = res.result;
						}
					});
				}
			})
		},
		onLoad() {},
		methods: {
			open() {
				this.$refs['popup'].open()
			},
			close() {
				this.$refs['popup'].close()
			},
			change({
				show
			}) {
				this.$emit('change', show)
			},
			updateScores() {
				cloudApi.call({
					name: "users",
					data: {},
					success: (res) => {
						this.scores = res.result[0].score
					}
				});
			},
			updateUserProfile() {
				uni.getUserProfile({
					desc: "用户请登录",
					success: (res) => {
						console.log(res);
						this.$store.commit('SET_ISLOGIN', true);
						this.userInfo = Object.assign(this.userInfo, res.userInfo);
						this.$store.commit('SET_USERINFO', this.userInfo);
						this.$emit('userInfoObtained', this.userInfo);
						cloudApi.call({
							name: "updateuserinfo",
							data: {
								userInfo: this.userInfo
							},
							success: (res) => {
							this.$emit('loginSuccess');
						}
						})
					},
					fail: (err) => {
						if (err.errMsg === 'getUserProfile:fail auth deny') return uni.showToast({
							title: '您取消了授权',
							duration: 2000
						});
					}
				})
				// this.SET_USERINFO(e.target.userInfo)
				// this.SET_ISLOGIN(true)
				// this.close()
			}
			// login() {
			// 	uni.showModal({
			// 		title: '温馨提示',
			// 		content: '亲，授权微信登录后才能正常使用小程序功能',
			// 		success(res) {
			// 			if (res.confirm) {
			// 				uni.getUserProfile({
			// 					desc: "注册用户信息使用",
			// 					lang: "zh_CN",
			// 					success: (res) => {
			// 						console.log('res', res)
			// 						uni.login({
			// 							provider: 'weixin',
			// 							success: function(loginRes) {
			// 								console.log('loginRes.authResult', loginRes);
			// 								uniCloud.callFunction({
			// 									name: 'user',
			// 									data: {
			// 										code:loginRes.code,
			// 										avatarUrl:res.userInfo.avatarUrl,
			// 										gender:res.userInfo.gender,
			// 										nickName:res.userInfo.nickName
			// 									}
			// 								}).then(res => {
			// 									console.log(res)
			// 								})
			// 							}
			// 						})

			// 					}
			// 				})
			// 			} else {
			// 				uni.showToast({
			// 					title: '您取消了授权',
			// 					duration: 2000
			// 				});
			// 			}
			// 		}
			// 	})
			// }
		}
	}
</script>

<style lang="scss" scoped>
	.popup-content {
		background-color: #FFFFFF;
		border-radius: 24rpx 24rpx 0 0;
		height: 50vh;
		padding: 50rpx 40rpx;
	}

	.close_btn {
		width: 40rpx;
		height: 40rpx;
	}
</style>